<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<link
	href="${pageContext.request.contextPath}/themes/bootstrap/easyui.css"
	rel="stylesheet">
<link href="${pageContext.request.contextPath}/themes/icon.css"
	rel="stylesheet">
<script src="${pageContext.request.contextPath}/js/jquery-1.7.2.min.js"></script>
<script src="${pageContext.request.contextPath}/js/jquery.easyui.min.js"></script>
<script src="${pageContext.request.contextPath}/js/easyui-lang-zh_CN.js"></script>
</head>
<script type="text/javascript">
$(function(){
	//加载页面的时候隐藏回复用户的表单
	$("#ma").hide();
	$('#moneyapplitable').datagrid({    
		    url:'${pageContext.request.contextPath}/moneyAppliFinish',
		    type:'post',
		    striped:true,
		    columns:[[  
		              {
		  				field : 'checked',
		  				checkbox : true,
		  				width : 100
		  			}, {
		  				field : 'maId',
		  				title : '钱财申请编号',
		  				width : 100,
		  				hidden : true
		  			},{
		  				field : 'aId',
		  				title : '申请编号',
		  				width : 100,
		  				hidden : true
		  			},{
		  				field : 'elName',
		  				title : '申请人',
		  				width : 100,
		  			},{
		  				field : 'dName',
		  				title : '申请部门',
		  				width : 100,
		  			},{
		  				field : 'aContent',
		  				title : '申请内容(双击查看详细内容)',
		  				width : 200,
		  			},{
		  				field : 'state',
		  				title : '审批状态',
		  				width : 100,
		  			},{
		  				field : 'money',
		  				title : '申请金额',
		  				width : 100,
		  			},{
		  				field : 'createDate',
		  				title : '申请日期',
		  				width : 100,
		  			},{
		  				field : 'approveDate',
		  				title : '审批日期',
		  				width : 100,
		  			}
		  	    ]] ,
		  	pagination:true,//在datagrid底部显示一个分页工具
			pageSize:5,//初始化页面的时候，设置页面大小为5
			pageList:[5,6,7,8],//分页页面大小选择    
			toolbar:[{
				text:'回复申请人',
				iconCls:'icon-edit',
				handler:function(){
					var appls = $("#moneyapplitable").datagrid('getSelections');
					if (appls.length != 1) {
						$.messager.confirm('提示', '请选择一条数据', function(r) {
							if (r) {
								$("#application").datagrid('unselectAll');
							}
						})
					} else {
						
						var appl=appls[0];
						$('#ma').form('load',appl);
						$('#ma').dialog({    
						    title: '申请回执单',    
						    width: 400,    
						    height: 400,          
						    modal: true,
						    toolbar:[{
								text:'提交',
								iconCls:'icon-ok',
								handler:function(){
								   $("#maform").form("submit");
								}
							}],
							onClose:function(){
								$("#moneyapplitable").datagrid('unselectAll');
							}
						});
					}
					
				}
			}],
			onDblClickCell: function(index,field,value){
					var valuekey="";
					$.each(value, function(i,item){
						valuekey+=item;
						if(i%49==0&&i!=0){
							valuekey+='<br>';
						}
					})
					value=valuekey;
					if(field=="aContent"){
						 $("#allcontent").window({    
							    title:"申请内容",
							    width:300,    
							    height:200,
							    content:value,
							    minimizable:false,
							    maximizable:false,
							    shadow:false
							});
					}
			}

	}); 
	//用户双击申请内容查看详细内容的事件
	
	//初始化回复各部门申请单
	$("#maform").form({
		url:'${pageContext.request.contextPath}/replyApplication',
		success:function(data){
			if(data=="1"){
				$('#ma').dialog('close');
				$("#maform").form('clear');
				$.messager.alert('提示','回复成功','info',function(){
					$('#moneyapplitable').datagrid('reload');
				});
			 }else{
				 alert("创建失败");
			 }
		}
	});
    //备注输入框的设置
    $("#beizhu").textbox({
    	
    	onChange:function(){
    		
    		if($("#beizhu").val().length>200){
    			$.messager.confirm('确认','内容长度太长',function(r){    
    			    if (r){    
    			    	$("#beizhu").textbox("clear");
    			    }    
    			}); 
    		}
    	}
    });

})

</script>
<body style="background-image: url(img/dmb.jpg);background-size:cover;">
   
    <div>
      <label style="margin-top:10px;margin-left:50px;color:orange;font-size: 20px">后勤部的运行规则</label>
    </div>
     <div style="height: 300px;">
       <img style="margin-left:50px;margin-top:20px;width:300px;height:250px;" src="img/ew.jpg">
    </div>
   
       <table id="moneyapplitable" ></table>
   
    <!-- 回复表单 -->
      <div id="ma">
        <form id="maform" method="post">
            <div style="margin-bottom: 20px;display: none;">
				<span>钱财申请编号：</span>
				<input class="easyui-textbox" name="maId" style="width: 100%;">
			</div>
			<div style="margin-bottom: 20px;display: none;">
				<span>申请编号：</span>
				<input class="easyui-textbox" name="aId" style="width: 100%;">
			</div>
			<div style="margin-bottom: 20px">
				<span>申请人：</span>
				<input class="easyui-textbox" name="elName" style="width: 100%"
					data-options="disabled:true">
			</div>
			<div style="margin-bottom: 20px">
				<span>申请部门：</span>
				<input class="easyui-textbox" name="dName" style="width: 100%"
					data-options="disabled:true">
			</div>
			<div style="margin-bottom: 20px">
				<span>申请内容：</span>
				<input class="easyui-textbox" name="aContent"
					style="width: 100%; height: 60px"
					data-options="disabled:true">
			</div>
			<div style="margin-bottom: 20px">
				<span>申请金额：</span>
				<input class="easyui-textbox" name="money"
					style="width: 100%;"
					data-options="disabled:true,">
			</div>
			<div style="margin-bottom: 20px;">
				<span>审批状态：</span>
				<input class="easyui-textbox" data-options="readonly:true" name="state" style="width: 100%;">
			</div>
			
			<div id="mamoney" style="margin-bottom: 20px">
				<span>备注：</span>
				<input id="beizhu"  class="easyui-textbox" name="note"
					style="width: 250px; height: 100px">
			</div>
		</form>
    </div>
   
   <div id="allcontent"></div> 
</body>
</html>